<!DOCTYPE html>
<%@page import="com.swadar.beans.valueobject.RecProductVO"%>
<%@page import="java.util.List"%>
<%@page import="com.swadar.beans.valueobject.ProductVO"%>
<%@page import="com.swadar.beans.dataobject.ProductDO"%>
<html lang="en">
<head>
<meta charset=utf-8>
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1" />
<title>Drinking is good for health..</title>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> 
<meta name="keywords" content="carousel, jquery, responsive, fluid, elastic, resize, thumbnail, slider" />
<meta name="author" content="Codrops" />
<link rel="stylesheet" type="text/css" href="/liquor/resources/css/elastislide.css" />
<link rel="stylesheet" type="text/css" href="/liquor/resources/css/custom.css" />
<link rel="stylesheet" type="text/css" href="/liquor/resources/css/pop-up.css"/>
<link rel="stylesheet" type="text/css" href="/liquor/resources/css/default.css" />
<link rel="stylesheet" type="text/css" href="/liquor/resources/css/component.css" />
<link rel="stylesheet" type="text/css" href="/liquor/resources/css/pop-up.css"/>
<link href="/liquor/resources/css/style.css" rel="stylesheet" />



<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<script src="/liquor/resources/js/script.js"></script>
<script src="/liquor/resources/js/pop-script.js"></script>
<script src="/liquor/resources/js/modernizr.js"></script>
<script src="/liquor/resources/js/conditional.js"></script>
<script src="/liquor/resources/js/unslider.min.js"></script>
<script src="/liquor/resources/js/modernizr.custom.17475.js"></script>
<script src="/liquor/resources/js/jquerypp.custom.js"></script>
<script src="/liquor/resources/js/jquery.elastislide.js"></script>
<script src="/liquor/resources/js/jquery.zoom.js"></script>
	
<script>
	$(function () {
		//$('#banner_wrapper ul').hide().removeClass('fallback');
		$('#all_categories span a').hover(function () {
			$('#banner_wrapper .fallback').css({display:"block"});
			$('#banner_wrapper .banner').css({display:"none"});
			});
		$('.container').mouseenter(function(){
			$('#banner_wrapper .fallback').css({display:"none"});
			$('#banner_wrapper .banner').css({display:"block"});
			});
	
		$('#product_header').mouseenter(function(){
			$('#banner_wrapper .fallback').css({display:"none"});
			$('#banner_wrapper .banner').css({display:"block"});
			});
			
			$('.fallback').mouseleave(function(){
			$('#banner_wrapper .fallback').css({display:"none"});
			$('#banner_wrapper .banner').css({display:"block"});
			});
			
	});
	</script>
    
   

<!--<script src="/liquor/resources/js/script.js"></script>-->

<!-- Notes: in a production environment, JS scripts and CSS should be concatenated. More scripts means more http requests which in turn means a slower site. Also comments would be removed to make the file as lean as possible. Finally, it's usually best to put links to all <script> files just before the final </body> tag. That way, the document has loaded before the JavaScript attempts to manipulate anything. However, I've left it in the head here so you see it! BF. -->
</head>
<body>
<!-- Wrapper Section begins From Here -->
	<div id="wrapper">
    
    	<!-- Top Header -->
        <div id="top_header">
        	<div id="navigation">
            	<div id="right_align">
                     <a href="#" class="topopup_2">Register</a>
                     <a href="#" class="topopup">Login</a>
                     
                     <a href="#">Wish list</a>
                     <a href="#">Help</a>
                 </div>
             </div>
        </div>
        <!-- Top Header Ends Here -->
        <div class="clear"></div>
        <!--<header>
        	<div id="header_con">
                <div id="header_div">
                    <a  class="header_a" href="/"><img src="/liquor/resources/images/liq-logo.png" alt="Liquor-Portal"/></a>
                    <nav> 
                        <ul id="mainNav">
                            <li><a href="index.html">HOME</a></li>
                            <li><a href="about.html">BEER</a></li>
                            <li><a href="offline.html">WHISKY</a></li>
                            <li><a href="redemption.html">SCOTCH</a></li>
                            <li><a href="video.html">VODKA</a></li>
                            <li><a href="3Dquiz.html">WINE</a></li>
                            <li><a href="3Dquiz.html">GIFTS</a></li>
                            <li><a href="3Dquiz.html">BARWARES</a></li>
                        </ul>
                    </nav> 
                    <div id="cart_store">
                    	<div id="cart_icon"><img src="/liquor/resources/images/shopping.jpg" alt="cart-detail"/></div>
                    </div>
                    <div id="cart_des">My cart (0)</div>	
                </div>
            </div>
	</header> -->
    <!--New section -->
    	<div class="container">
				
			<div class="main">
            
				<nav id="cbp-hrmenu" class="cbp-hrmenu">
                	
					<ul>
                    	<li><img src="/liquor/resources/images/liq-logo.png" alt="Liquor-Portal"/></li>
						<li>
							<a href="#">Products</a>
							<div class="cbp-hrsub">
								<div class="cbp-hrsub-inner"> 
									<div>
										<h4>Learning &amp; Games</h4>
										<ul>
											<li><a href="#">Catch the Bullet</a></li>
											<li><a href="#">Snoopydoo</a></li>
											<li><a href="#">Fallen Angel</a></li>
											<li><a href="#">Sui Maker</a></li>
											<li><a href="#">Wave Master</a></li>
											<li><a href="#">Golf Pro</a></li>
										</ul>
									</div>
									<div>
										<h4>Utilities</h4>
										<ul>
											<li><a href="#">Gadget Finder</a></li>
											<li><a href="#">Green Tree Express</a></li>
											<li><a href="#">Green Tree Pro</a></li>
											<li><a href="#">Wobbler 3.0</a></li>
											<li><a href="#">Coolkid</a></li>
										</ul>
									</div>
									<div>
										<h4>Education</h4>
										<ul>
											<li><a href="#">Learn Thai</a></li>
											<li><a href="#">Math Genius</a></li>
											<li><a href="#">Chemokid</a></li>
										</ul>
										<h4>Professionals</h4>
										<ul>
											<li><a href="#">Success 1.0</a></li>
											<li><a href="#">Moneymaker</a></li>
										</ul>
									</div>
								</div><!-- /cbp-hrsub-inner -->
							</div><!-- /cbp-hrsub -->
						</li>
						<li>
							<a href="#">Downloads</a>
							<div class="cbp-hrsub">
								<div class="cbp-hrsub-inner">
									<div>
										<h4>Education &amp; Learning</h4>
										<ul>
											<li><a href="#">Learn Thai</a></li>
											<li><a href="#">Math Genius</a></li>
											<li><a href="#">Chemokid</a></li>
										</ul>
										<h4>Professionals</h4>
										<ul>
											<li><a href="#">Success 1.0</a></li>
											<li><a href="#">Moneymaker</a></li>
										</ul>
									</div>
									<div>
										<h4>Entertainment</h4>
										<ul>
											<li><a href="#">Gadget Finder</a></li>
											<li><a href="#">Green Tree Express</a></li>
											<li><a href="#">Green Tree Pro</a></li>
											<li><a href="#">Holy Cannoli</a></li>
											<li><a href="#">Wobbler 3.0</a></li>
											<li><a href="#">Coolkid</a></li>
										</ul>
									</div>
									<div>
										<h4>Games</h4>
										<ul>
											<li><a href="#">Catch the Bullet</a></li>
											<li><a href="#">Snoopydoo</a></li>
											<li><a href="#">Fallen Angel</a></li>
											<li><a href="#">Sui Maker</a></li>
											<li><a href="#">Wave Master</a></li>
											<li><a href="#">Golf Pro</a></li>
										</ul>
									</div>
								</div><!-- /cbp-hrsub-inner -->
							</div><!-- /cbp-hrsub -->
						</li>
						<li>
							<a href="#">Applications</a>
							<div class="cbp-hrsub">
								<div class="cbp-hrsub-inner"> 
									<div>
										<h4>Learning &amp; Games</h4>
										<ul>
											<li><a href="#">Catch the Bullet</a></li>
											<li><a href="#">Snoopydoo</a></li>
										</ul>
										<h4>Utilities</h4>
										<ul>
											<li><a href="#">Gadget Finder</a></li>
											<li><a href="#">Green Tree Express</a></li>
											<li><a href="#">Green Tree Pro</a></li>
											<li><a href="#">Wobbler 3.0</a></li>
											<li><a href="#">Coolkid</a></li>
										</ul>
									</div>
									<div>
										<h4>Education</h4>
										<ul>
											<li><a href="#">Learn Thai</a></li>
											<li><a href="#">Math Genius</a></li>
											<li><a href="#">Chemokid</a></li>
										</ul>
										<h4>Professionals</h4>
										<ul>
											<li><a href="#">Success 1.0</a></li>
											<li><a href="#">Moneymaker</a></li>
										</ul>
									</div>
								</div><!-- /cbp-hrsub-inner -->
							</div><!-- /cbp-hrsub -->
						</li>
						<li>
							<a href="#">Projects</a>
							<div class="cbp-hrsub">
								<div class="cbp-hrsub-inner"> 
									<div>
										<h4>Learning &amp; Games</h4>
										<ul>
											<li><a href="#">Catch the Bullet</a></li>
											<li><a href="#">Snoopydoo</a></li>
											<li><a href="#">Fallen Angel</a></li>
											<li><a href="#">Sui Maker</a></li>
											<li><a href="#">Wave Master</a></li>
											<li><a href="#">Golf Pro</a></li>
										</ul>
										<h4>Utilities</h4>
										<ul>
											<li><a href="#">Gadget Finder</a></li>
											<li><a href="#">Green Tree Express</a></li>
										</ul>
									</div>
									<div>
										<h4>Entertainment</h4>
										<ul>
											<li><a href="#">Gadget Finder</a></li>
											<li><a href="#">Green Tree Express</a></li>
											<li><a href="#">Green Tree Pro</a></li>
											<li><a href="#">Holy Cannoli</a></li>
											<li><a href="#">Wobbler 3.0</a></li>
											<li><a href="#">Coolkid</a></li>
										</ul>
									</div>
								</div><!-- /cbp-hrsub-inner -->
							</div><!-- /cbp-hrsub -->
						</li>
						<li>
							<a href="#">Freeware</a>
							<div class="cbp-hrsub">
								<div class="cbp-hrsub-inner"> 
									<div>
										<h4>Utilities</h4>
										<ul>
											<li><a href="#">Green Tree Pro</a></li>
											<li><a href="#">Wobbler 3.0</a></li>
											<li><a href="#">Coolkid</a></li>
										</ul>
										<h4>Education</h4>
										<ul>
											<li><a href="#">Learn Thai</a></li>
											<li><a href="#">Math Genius</a></li>
											<li><a href="#">Chemokid</a></li>
										</ul>
									</div>
									<div>
										<h4>Professionals</h4>
										<ul>
											<li><a href="#">Success 1.0</a></li>
											<li><a href="#">Moneymaker</a></li>
										</ul>
									</div>
									<div>
										<h4>Learning &amp; Games</h4>
										<ul>
											<li><a href="#">Catch the Bullet</a></li>
											<li><a href="#">Snoopydoo</a></li>
											<li><a href="#">Fallen Angel</a></li>
											<li><a href="#">Sui Maker</a></li>
											<li><a href="#">Wave Master</a></li>
											<li><a href="#">Golf Pro</a></li>
										</ul>
									</div>
								</div><!-- /cbp-hrsub-inner -->
							</div><!-- /cbp-hrsub -->
						</li>
                        <li> 
                        	<div style="width:100%; background:#F00;">
                        	<div id="cart_store">
                    			<div id="cart_icon"><img src="/liquor/resources/images/shopping.jpg" alt="cart-detail"/></div>
                    		</div>
                    		<div id="cart_des">My cart (0)</div>
                            </div>
                        </li>
					</ul>
				</nav>
			</div>
		</div>
    <!--New Section Ends Here -->
    <div class="clear"></div>
    <!-- Product - HTML Page	-->
    
    <!-- Content Area -->
    	<div id="content_area">
        	<div id="all_categories"><span><a href="#">All CATEGORIES</a></span></div>
            <div id="contact_no"><span>CALL NOW</span><br>080 66778899</div>
            <!--Search- Box Starts From Here -->
           	<div id="search_box">
				<form id="search-form" method="post" enctype="multipart/form-data">
					<fieldset>
						<div class="search-field">
							<input name="search" type="text" placeholder="search" />
							<a class="search-button" href="#" onclick="document.getElementById('search-form').submit()" >#</a>
						</div>
					</fieldset>
				</form>
			</div>
             <div class="clear"></div>
        	 <div class="border_div"></div>
      	</div>
       
        <div class="clear"></div>
        <!-- Content Header Ends Here-->
        <!-- This section is for hide and play-->
       
        <!-- do the div man--> 
        <!-- Banner Section Commence Here -->
        <div id="banner_wrapper">
        	<!-- div for hide and seek-->
            <div class="fallback">
            	<div id="all_textcontainer">
                    <h5>BEER <span>&#215;</span></h5>
                    <p><a href="#">Budwiser</a></p><br>
                    <p><a href="#">Charlsberg</a></p><br>
                    <p><a href="#">Heineken</a></p><br>
                    <p><a href="#">Kingfisher</a></p><br>
                    <p><a href="#">Toborg</a></p><br><br><br>
                    <h5>WHISKY <span>&#215;</span></h5>
                    <p><a href="#">100 Pipers</a></p><br>
                    <p><a href="#">Antiquity</a></p><br>
                    <p><a href="#">Bagpiper</a></p><br>
                    <p><a href="#">Black Dog</a></p><br>
                    <p><a href="#">Directors Special</a></p><br>
                    <p><a href="#">Mc Dowells</a></p><br>
                    <p><a href="#">Royal Challenge</a></p>
                </div>
                <div id="all_textcontainer">
                    <h5>SCOTCH <span>&#215;</span></h5>
                    <p><a href="#">100 Pipers</a></p><br>
                    <p><a href="#">Ballentines</a></p><br>
                    <p><a href="#">Chivas Regal</a></p><br>
                    <p><a href="#">Johnnie Walker Blue Label</a></p><br>
                    <p><a href="#">Johnnie Walker Red Label</a></p><br>
                    <p><a href="#">Teachers</a></p><br>
                    <p><a href="#">VAT 69</a></p><br><br>
                    <h5>VODKA<span>&#215;</span></h5>
                    <p><a href="#">Absolute</a></p><br>
                    <p><a href="#">Finlandia</a></p><br>
                    <p><a href="#">Fuel</a></p><br>
                    <p><a href="#">Romonova</a></p><br>
                    <p><a href="#">Smirnoff</a></p><br>
                </div>
                
                <div id="all_textcontainer">
                    <h5>SINGLE MALT <span>&#215;</span></h5>
                    <p><a href="#">AmruthFusion</a></p><br>
                    <p><a href="#">Amruth Indian</a></p><br>
                    <p><a href="#">Glennfiddich</a></p><br>
                    <p><a href="#">MC Single Malt</a></p><br><br><br>
                    <h5>WINE <span>&#215;</span></h5>
                    <p><a href="#">Four Seasons</a></p><br>
                    <p><a href="#">Allegrini</a></p><br>
                    <p><a href="#">Grover</a></p><br>
                    <p><a href="#">Henri Bourgeois</a></p><br>
                    <p><a href="#">Lindeman’s</a></p><br>
                    <p><a href="#">Maison</a></p><br>
                    <p><a href="#">Piaccini</a></p><br>
                    <p><a href="#">Sula</a></p>
                    
                </div>
                
                 <div id="all_textcontainer">
                    <h5>BRANDY <span>&#215;</span></h5>
                    <p><a href="#">Cognac</a></p><br>
                    <p><a href="#">Honey Bee</a></p><br>
                    <p><a href="#">Martel</a></p><br><br>
                    <h5>GIN <span>&#215;</span></h5>
                    <p><a href="#">Blue Berry</a></p><br>
                    <p><a href="#">Blue Moon</a></p><br>
                    <p><a href="#">Gordons London</a></p><br>
                    <p><a href="#">Tenquerey</a></p><br><br>
                    <h5>RUM <span>&#215;</span></h5>
                    <p><a href="#">Bacardi</a></p><br>
                    <p><a href="#">Havana</a></p><br>
                    <p><a href="#">Old Monk</a></p>
                   </div>
                
                 <div id="all_textcontainer">
                    <h5>CHAMPAGNE <span>&#215;</span></h5>
                    <p><a href="#">Bollinger</a></p><br>
                    <p><a href="#">Lanson</a></p><br>
                    <p><a href="#">Taittinger</a></p><br><br><br>
                    <h5>TEQUILA <span>&#215;</span></h5>
                    <p><a href="#">Deshmondji</a></p><br>
                    <p><a href="#">Suaza Tequila</a></p><br>
                    <p><a href="#">Tequila Camino</a></p>
             	</div>
               
                <div id="all_imagecontainer">
                	<a href="#"><div id="all_catimage">
                    	<img src="/liquor/resources/images/allCategory.jpg"/>
                    </div>
                    <p>CHEVAS REGAL</p>
                    <div id="rupee_symbolcontainer"><img src="/liquor/resources/images/rupee-symbol.png"/><p>&nbsp;&nbsp;&nbsp;&nbsp;1320</p></div>
                    </a>
                </div>
               
            
            </div>
            
        	<div class="banner has-dots">
				<!--<ul>
                    <li><img src="/liquor/resources/images/img_1.jpg" /></li>
                    <li><img src="/liquor/resources/images/img_2.jpg" /></li>
                    <li><img src="/liquor/resources/images/img_3.jpg" /></li>
                    <li><img src="/liquor/resources/images/img_4.jpg" /></li>
                    <li><img src="/liquor/resources/images/img_5.jpg" /></li>
                   
                 </ul>-->
			</div>
            
        </div>
        <!-- Banner Section Ends Here -->
        
        
        <!-- Product View Section Commence from Here -->
        
        <%
        	ProductVO productVO = (ProductVO) request.getAttribute("productVO"); 
        %>
        
        <div id="product_header"><div id="header_text">Whisky &gt; Bluelabel</div></div>
        <div class="clear"></div>
        <div id="productpage_wrapper">
        	<div id="productimage_view">
            	<div id="productpage_image">
                	<span class='zoom' id='ex2'>
                		<img src="/liquor/resources/images/<%=productVO.getImage() %>"/>
                    </span>
                    <div class="clear"></div>
                    <p>Click on product to Zoom</p>
                </div>
                <a href="" class="mar_rightfora">Gift this</a>
                <a href="" class="mar_rightfora">Save for later</a>
                <a href="">Send it to Friend</a>
            </div>
            <!-- This page for product Description -->
            <div id="productpage_des">
            	<div id="productpage_header"><%=productVO.getName() %><br>BLUE LABEL PREMIUM WHISKY</div>
                <div id="product_type">Type: Double molt premium whisky | <%=productVO.getMl() %> ml
                	<p><%=productVO.getDescription() %></p>
                    <p>Availability:
                    <% if(productVO.getQuantity()>0){ %>
                    	<span>In stock</span></p>
                   	<% }else{ %>
                    	<span>No Stock</span></p>
                    <% } %>
                    
                </div>
                <div id="price_quantity">
         			<div id="quantity_txtfield"><span class="font-colorprice">Rs.&nbsp;&nbsp;<%=productVO.getPrice() %>/-</span>&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;Quantity
                    </div> 
                    <div id="quantity_container">
                    	<form id="quantity-form" method="post" enctype="multipart/form-data">
                        	<fieldset> 
                            	<input name="quantity" type="text" id="quantity"  maxlength="2" value="" required />
                          	</fieldset>
                     	</form>
                	</div>
                    <div id="errmsg"></div>
               </div>
               <div class="clear"></div>
               <div id="ppage_bcontainer">
               		<a href="" class="buy_button">BUY NOW&nbsp;<span>]</span></a>
                    <a href="" id="ppage_addcart"><span>Â</span>&nbsp;&nbsp;ADD TO CART</a>
                    <a href="" id="ppage_wishlist">ADD TO WISH LIST</a>
               </div>
               
 <!-- Start Recommened Product -->
               <div class="clear"></div>
               <div id="ppage_recommened">
               		<h4>Recommended Products along with this Product</h4>
               </div>
               <div class="clear"></div>
               <div id="ppage_recommenedcontainer">
               <%List productList = (List) request.getAttribute("productVOList");
               		for(int i=0;i<productList.size();i++){ 
               		RecProductVO recProductVO = (RecProductVO)productList.get(i);
               %>
               		<div id="recomend_productDescription">
                        <div id="recom_imgcon">
                            <div id="recom_imagediv">
                                <img src="/liquor/resources/images/<%=recProductVO.getImage()%>"/>
                            </div>
                            <a href=""><span>Â</span></a>
                        </div>
                        <div class="clear"></div>
                         <div id="recom_desc">
                    		<%=recProductVO.getName()%><br>Rs.<%=recProductVO.getPrice()%>/-
                   		 </div>
                    </div>
               <%}%>
                </div>
            </div>
        </div>
<!-- Recommened Product View Section Ends Here -->
        
        <div class="clear"></div>
        <!-- Gap -->
         <div id="box"></div>
         <div class="clear"></div>
         <!-- Details Section Commence from Here -->
        <div id="grey_box">
         	<div id="grey_wrapper">
            	<div class="clear"></div>
            	<div id="quote">
                	<div id="quote_img"><img src="/liquor/resources/images/quotes.jpg" alt="quotes"/></div>
                    <p class="pad_left">I am very satisfied with the quality and timely delivery of the cake I                      ordered.for a friend and she is very happy too.
                    </p>
                    <h5>- Anushka Kapur (22 Feb 2013)</h5>
             	</div>
				<div id="payment">
                	<p>PAYMENT METHODS</p>
                    <div id="payment_imgcon" class="pad-left"><a href="#"><img src="/liquor/resources/images/visa.jpg" alt="" /></a></div>
                    <div id="payment_imgcon"><a href="#"><img src="/liquor/resources/images/master.jpg" alt="" /></a></div>
                    <div id="payment_imgcon"><a href="#"><img src="/liquor/resources/images/cash.jpg" alt="" /></a></div>
                </div>
                <div id="social_net">
                	<div id="social_imgcon"><img src="/liquor/resources/images/social-label.jpg" alt="Social-icon" /></div>
                    <div id="social_item"><a href="https://www.facebook.com/pages/Swadar-Constructions/583307835028687" class="social_col1">&#228;</a></div>
                    <div id="social_item"><a href="" class="social_col2">&#240;</a></div>
                    <div id="social_item"><a href="" class="social_col3">&#229;</a></div>
                    <div id="social_item"><a href="" class="social_col4">&#237;</a></div>
                </div>
                <div class="clear"></div>
         	</div>
          	<div class="clear"></div>
            <div id="infolink_wrapper">
            	<div id="info">
                	<h5>Information</h5>
                    <a href="#">About us</a><br><br>
                    <a href="#">Contact</a><br><br>
                    <a href="#">Order Tracking</a><br><br>
                    <a href="#">Payment Options</a><br><br>
                    <a href="#">Cancelation &amp; Returns</a>
                </div>
                <div id="policy">
                	<h5>policies</h5>
                    <a href="#">Terms and Conditions</a><br><br>
                    <a href="#">Privacy Policy</a>
                </div>
                <div id="contact_detail">
                	<input type="text" name="your-email" placeholder="you@yourmail.com" title="your email" class="cform-text">
              		<input type="submit" value="SUBMIT" class="cform-submit">
                    <p>Enter your e-mail to recieve our offers, news etc.,<br>*Your data will not be shared with others and you can unsubscribe at any time.</p>
                </div>
            	<div class="clear"></div>
            </div> 
     	</div>
        <div class="clear"></div>
        <!-- Footer Section Commence From Here-->
        <footer>
        	<div id="footer_wrapper">
           		 <span>&copy; 2013 Cake of the Day. All Rights Reserved.</span>
                 <a href="#">Shipping &amp; Delievery Policies</a>
                 <a href="#">Cancelation &amp; Modification Policies</a>
                 <a href="#">Gift Card Policies</a>
                 <a href="#">Orders &amp; Returns</a>
                 <a href="#">Payment Policies</a>
        	</div>
        </footer>
	</div>

    
    <!-- This Section is for pop-up code -->
        <div id="toPopup"> 
		<div class="close"></div>
       	<span class="ecs_tooltip">Press Esc to close <span class="arrow"></span></span>
		<div id="popup_content"> <!--your content start-->
            <header><h1 class="header_color">MEMBER SIGN IN</h1>
            	<span>Already member? you may sign in here.</span>
                
         	</header>
            <div class="clear"></div>
            <div class="social_btncontainer">
            	
            	<a href="http://www.google.com">
                	<div class="btn_facebookcontainer">
            			<div class="social_imgcon facebook_btn"><img src="/liquor/resources/images/Login-facebook.jpg"/></div>
                    	<div class="social_text">&nbsp;&nbsp;&nbsp;Sign in With Facebook</div>
                    </div>
                </a>
                <div class="clear"></div>
                <a href="http://www.google.com">
                	<div class="btn_googlecontainer">
            			<div class="social_imgcon google_btn"><img src="/liquor/resources/images/Login-google.jpg"/></div>
                    	<div class="social_text">&nbsp;&nbsp;&nbsp;Sign in With google</div>
                    </div>
                </a>
                 <p>Not a member yet? <a href="#" class="topopup_2 underline_link">SIGN UP</a></p>
                </div>
                <div class="border_container">
                	<p><img src="/liquor/resources/images/popborder.jpg" /></p>
                </div>
                <div class="login_detail">
                	<form class="contact_form" action="" method="">
                		<input type="email" name="email" id="email_text" placeholder="Email:" required/><br><br>
                    	<input type="password" name="password" placeholder="Password:" required/><br><br>
                        <input class="check_remin" type="checkbox" name="reminder" value="" /><span>Remember Me</span>
                    	<button class="submit" type="submit">SIGN IN</button><br><br>
                        <div class="clear"></div>
                        <div class="forgot_alignment"><a href="#" class="topopup_3">Forgot Password</a></div>
                    </form>
                </div>
           
        </div> <!--your content end-->
	</div> <!--toPopup end-->
    
    <div id="toPopup_2"> 
    	<div class="close"></div>
       	<span class="ecs_tooltip">Press Esc to close <span class="arrow"></span></span>
		<div id="popup_content"> <!--your content start-->
            <header><h1 class="header_color1">NEW USER JOIN NOW!</h1>
            	<span>Welcome Guest.</span>
                
         	</header>
            <div class="clear"></div>
            <div class="signup_btncontainer">
            	
            	<a href="http://www.google.com">
                	<div class="btn_facebookcontainer">
            			<div class="social_imgcon facebook_btn"><img src="/liquor/resources/images/Login-facebook.jpg"/></div>
                    	<div class="social_text">&nbsp;&nbsp;&nbsp;Sign in With Facebook</div>
                    </div>
                </a>
                <div class="clear"></div>
                <a href="http://www.google.com">
                	<div class="btn_googlecontainer">
            			<div class="social_imgcon google_btn"><img src="/liquor/resources/images/Login-google.jpg"/></div>
                    	<div class="social_text">&nbsp;&nbsp;&nbsp;Sign in With google</div>
                    </div>
                </a>
                 <p>Already a member? <a href="#" class="topopup underline_link">SIGN IN</a></p>
                </div>
                <div class="border_container border_topspace">
                	<p><img src="/liquor/resources/images/popborder.jpg" /></p>
                </div>
                <div class="login_detail">
                	<form class="contact_form" action="" method="">
                    	<input type="text" name="name"  placeholder="Name:" oninput="check(this)" required/><br><br>
                		<input type="email" name="email"  placeholder="Email:" required/><br><br>
                    	<input type="password" name="password" placeholder="Password:" required/><br><br>
                        <input type="radio" name="gender" value="Male" checked="true" />Male
                        <input type="radio" name="gender" value="Female" checked="false" />Female
                    	<button class="submit" type="submit">SIGN UP</button><br><br>
                        <div class="clear"></div>
                        <p class="top-alignp">I agree to&nbsp;<a href="#" class="topopup_2 underline_link">Terms &amp; Conditions</a></p>
                    </form>
                </div>
           
        </div> <!--your content end-->
	</div> <!--toPopup end-->
    
    <div id="toPopup_3"> 
		<div class="close"></div>
       	<span class="ecs_tooltip">Press Esc to close <span class="arrow"></span></span>
		<div id="popup_content"> <!--your content start-->
        	 <header><h1 class="header_color1">HAVE YOU FORGOTTEN YOUR PASSWORD?</h1><br>
            	<p>Please enter your email address below to retrieve your password?</p><br>
        	</header>
            <div class="forgot_container">
                <form class="forgot_form" action="" method="">
                    <input type="email" name="email"  placeholder="Email:" required/>
                    <button class="submit" type="submit">SUBMIT</button><br><br>
                    <div class="clear"></div>
                </form>
            </div>
        </div> <!--your content end-->
	</div> <!--toPopup end-->
    
 
    
	<div class="loader"></div>
   	<div id="backgroundPopup"></div>
    
    <!--  Pop Section Ends Here -->
    
	
		<script src="/liquor/resources/js/cbpHorizontalMenu.min.js"></script>
		<script>
			$(function() {
				cbpHorizontalMenu.init();
			});
		</script>
        <script>
		$(document).ready(function () {
  //called when key is pressed in textbox
  
  $("#quantity").keypress(function (e) {
     //if the letter is not digit then display error and don't type anything
	
     if (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) {
        //display error message
        $("#errmsg").html("Digits Only").show().fadeOut("slow");
               return false;
    }
   });
});
		</script>
        
     <!-- This Code for Zooming the Image -->   
     <script>
		$(document).ready(function(){
			$('#ex2').zoom({ on:'grab' });
		});
	</script>
    <!-- This Code for Zooming Ends Here -->
        
        
</body>
</html>
